<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>逗你玩</title>
		<style type="text/css">
			#main{
				height: 100vh;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
			}
			.title{
				font-family: PingFangSC-Semibold;
				color: rgb(255,90,28);
				font-size: 80px;
			}
			.content{
				display: flex;
				justify-content: space-between;
				width: 800px;
			}
			.center{
					color: #fff;
				font-size: 60px;
				background-image: linear-gradient(90deg, #FF9320 0%, #FF511D 98%);
box-shadow: 0 4px 8px 0 rgba(255,103,30,0.30);
border-radius: 4px;
				width: 320px;
				height: 100px;
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.left{
			
			}
			.right{
			}
		</style>
	</head>
	<body>
		
		<div id="main">
			<p class="title">做我老婆好不好！！！</p>
			<div class="content">
				<div class="center left">
				<span>
					好的
				</span>
			</div>
			<div class="center right">
				<span>不好</span>
			</div>
				
			</div>
		</div>
		
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script type="text/javascript">
			$(function(){
				$(".right").off("click")
				$(".right").on("click",function(){
					alert("房子写你名字")
					alert("保大")
					alert("最爱你")
				})
				$(".left").off("click")
				$(".left").on("click",function(){
					alert("我爱你，余生多多指教")
				})
				
			})
		</script>
	</body>
</html>
